:root {
  --size: 100%
}

#indicatorContainer {
  position: relative;
  height: var(--size);
  width: var(--size);
}

#indicator {
  width: var(--size);
  height: var(--size);
  position: absolute;
  /* top: calc(50% - var(--size));
  left: calc(50% - var(--size)); */
  top: 0;
  left: 0;
  animation: spin 1s linear infinite;
}

#circle {
  fill: none;
  stroke: rgba(255, 0, 0, 0.8);
  stroke-linecap: round;
  stroke-width: 10;
  animation: draw 3s ease-in-out infinite;
}

@keyframes draw {
  0% { stroke-dasharray: 20, 282.6;}
  50% { stroke-dasharray: 200, 282.6; }
  100% { stroke-dasharray: 20, 282.6; }
}

@keyframes spin {
  to { transform: rotate(360deg); }
}
